import type { BaiduElements } from '../../../../../../../../types/constants'
import { ThemeVarService } from '../../../../../../../../lib/abstract/style/theme_var/service'
import {
  generateHideSelector,
  PAGE_ELEMENTS,
  SUPPORTED_PLATFORMS,
} from '../../../../../../../../types/constants'

export class BaiduNotePage {
  elements: BaiduElements = PAGE_ELEMENTS[SUPPORTED_PLATFORMS.BAI_DU]
  private static instance: BaiduNotePage
  private readonly themeVarService: ThemeVarService = ThemeVarService.getInstance()

  /**
   * 获取单例实例
   */
  public static getInstance(): BaiduNotePage {
    if (!BaiduNotePage.instance) {
      BaiduNotePage.instance = new BaiduNotePage()
    }
    return BaiduNotePage.instance
  }

  init(): void {
  }

  /**
   * 无搜索结果样式
   */
  noSearchResult(): string {
    return `
    #results:has(.noresult-container) {
      width: fit-content !important;
      margin: 0 auto !important;
      
      .noresult-container {
        p {
          color: var(${this.themeVarService.search.default.text}) !important;
        }
      }
    }
`
  }

  getMainStyles(): string {
    return `
  /* 隐藏样式 */
  &:has(${generateHideSelector('#page-hd .note-number-tip-pc')}) {
    #page-bd #results:not(:has(.noresult-container)) {
      margin-top: 20px !important;
    }
  }

  /* 主样式 */  
  .se-page-hd {
    background: transparent !important;
    
    .note-number-tip-pc {
      margin-top: 16px !important;
      background: transparent !important;
      color: var(${this.themeVarService.search.default.text}) !important;
    }
  }
  
  /* 无搜索结果样式 */
  #page-bd {
    ${this.noSearchResult()}
  }
  
  /* 有搜索结果样式 */
  #page-bd {
    background: transparent !important;
    
    #results:not(:has(.noresult-container)) {
      .col-container {
        background: transparent !important;
        
        .col-wrapper {
          article {
            background: var(${this.themeVarService.search.resultItem.background}) !important;
            padding: 20px 10px !important;
            
            [class^=image]:has(.cos-image) {
              margin: -20px -10px var(--cos-space-none) -10px !important;
              
              .cos-image {
                border-bottom-left-radius: 0 !important;
                border-bottom-right-radius: 0 !important;
                
                &::before {
                  border-radius: 0 !important;
                }
              }
            }
            
            [class^=image]:has(.sc-image) {
              margin: -20px -10px 0 -10px !important;
              
              .sc-image {
                border-bottom-left-radius: 0 !important;
                border-bottom-right-radius: 0 !important;
              }
            }
            
            /* 标题 */
            h3.cosc-title {
              .tts-b-hl {
                color: var(${this.themeVarService.link.default.text}) !important;
                
                &:hover {
                  color: var(${this.themeVarService.link.default.textHover}) !important;
                }
              }
            }
            
            /* 元数据 */
            [class^=source-left] {
              &:hover {
                [class*=source-name] {
                  color: var(${this.themeVarService.link.default.text}) !important;
                }
              }
              
              div {
                color: var(${this.themeVarService.search.default.text}) !important;
              }
            }
          }
        }
      }
    }
  }
  
  #page-ft {
    background: transparent !important;

    /* 加载 */
    .infinite-load-wrap {
      .se-infiniteload {
        background: transparent !important;
        border: none !important;
        
        /* 加载图标 */
        .se-infiniteload-loading-icon {
          background-color: var(${this.themeVarService.search.default.text}) !important;
        }

        /* 没有更多/正在加载 */
        .se-infiniteload-nomore, .se-infiniteload-text span {
          color: var(${this.themeVarService.search.default.text}) !important;
        }
      }
    }
    
    .se-copyright-simple {
      background: transparent !important;
      color: var(${this.themeVarService.search.default.text}) !important;
    }
  }
`
  }
}
